<template>
    <el-form ref="wordWriteForm" :model="wordWrite" label-width="100px" :inline="true" size="small">
        <div v-if="writeStatus">
            <el-form-item label="课程类型" prop="courseParentId">
                <el-select v-model="wordWrite.courseParentId" placeholder="请选择课程类型" @change="courseChangeEvent" >
                    <el-option v-for="item in parentCourseData" :key="item.value" :label="item.label" :value="item.value"/>
                </el-select>
            </el-form-item>
            <el-form-item label="课程" prop="courseId">
                <el-select v-model="wordWrite.courseIds" multiple placeholder="请选择课程">
                    <el-option v-for="item in childCourseData" :key="item.value" :label="item.label" :value="item.value"/>
                </el-select>
            </el-form-item>

            <el-form-item label="考试类型" prop="dictType">
                <el-select v-model="wordWrite.dictType" placeholder="考试类型" >
                    <el-option label="日译中（推荐）" value="RI_RO_ZH"/>
                    <el-option label="中译日（不建议）" value="ZH_TO_RI"/>
                </el-select>
            </el-form-item>
       
            <el-button size="small" type="primary" @click="start"   icon="el-icon-search">开始考试</el-button>
        </div>
        <!-- <div v-else>
            <el-button size="small" type="success"  icon="el-icon-download">提交答卷</el-button>
        </div> -->
    </el-form>
</template>

<script>
export default{
    props: {
        wordWrite: {
            type: Object,
            required: true,
        },
        writeStatus:{
            type: Boolean,
            required: true
        },
        //渲染主课程的数据
        parentCourseData :{
            type: Array,
            required: true
        },
        //渲染子课程的数据
        childCourseData :{
            type: Array,
            required: true
        }
    },
    methods:{
        start(){
            this.$emit("start");
        },
        //课程数据改变
        courseChangeEvent(v){
            this.$emit('updateCourseChange',v)
        },
    }

}
</script>

<style scoped lang="scss">

</style>